WooCommerce 产品详情页隐藏 「其他信息」 和 「用户评价」 标签的实用方法

9次阅读
没有评论

共计 2403 个字符,预计需要花费 7 分钟才能阅读完成。

在使用 WooCommerce 搭建 WordPress 电商网站时,你可能会注意到:
每个产品详情页默认都会显示三个标签页 (Tabs):

  • 产品描述 (Description
  • 其他信息 (Additional Information
  • 用户评价 (Reviews

虽然这些标签可以帮助用户了解产品,但对于某些简约型商店或单一产品页而言,这些信息可能显得多余。
比如:

你只想展示一段简短的产品介绍,不希望出现 「重量、尺寸」 等自动生成的 「其他信息」;
或者你不希望开启用户评价功能,让页面更简洁、专注于转化。

本文将教你如何 WooCommerce 产品详情页中删除 「其他信息」 和 「用户评价」 标签,让你的产品页面更简洁、美观。

 

一、通过代码删除 WooCommerce 标签 (推荐方式)

WooCommerce 提供了一个非常实用的过滤器 woocommerce_product_tabs,我们可以通过它自由地移除或修改任何产品详情页标签。

你只需在主题的 functions.php 文件或自定义插件中添加以下代码:

add_filter('woocommerce_product_tabs', 'haozhuti_remove_product_tabs', 98);
function haozhuti_remove_product_tabs($tabs) {// 移除 「其他信息」 标签
    unset($tabs['additional_information']);

    // 移除 「用户评价」 标签
    unset($tabs['reviews']);

    return $tabs;
}

 

效果:

  • 页面中不再显示 「其他信息」 与 「用户评价」;
  • 仅保留 「描述」 标签;
  • 页面更简洁,更符合定制化主题的视觉风格。

 

二、彻底去掉所有 Tabs,仅显示描述内容

有时你可能希望 彻底移除标签系统,让产品页面直接显示描述文本。
这种方式非常适合:

  • 单页产品销售网站;
  • 使用自定义页面构建器 (如 Elementor) 时。

将以下代码添加到 functions.php 中:

// 移除 WooCommerce 默认的产品 Tabs
remove_action('woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 10);

// 仅显示产品描述内容
add_action('woocommerce_after_single_product_summary', 'haozhuti_show_description_only', 10);
function haozhuti_show_description_only() {the_content(); // 输出产品描述
}

 

效果:

  • 不再显示 Tabs 样式;
  • 页面只展示主要产品内容;
  • 对简洁风或营销型落地页特别友好。

 

三、通过 CSS 隐藏 (简单但不推荐)

如果你暂时不方便修改代码,也可以用 CSS 来隐藏这些标签。
虽然这种方式无法从结构上移除标签 (仍会被搜索引擎抓取),但可以快速达到视觉隐藏效果:

.woocommerce-tabs .wc-tab#tab-additional_information,
.woocommerce-tabs .wc-tab#tab-reviews,
.woocommerce-tabs ul.tabs li.additional_information_tab,
.woocommerce-tabs ul.tabs li.reviews_tab {display: none !important;
}

 

注意:

此方法只是 「隐藏」,并未真正删除内容。对 SEO 影响较小,但仍建议使用 PHP 代码的方式实现。

 

四、只隐藏特定标签 (例如仅隐藏 「其他信息」)

如果你希望保留用户评价,只隐藏 「其他信息」 这一项,可以这样做:

add_filter('woocommerce_product_tabs', 'haozhuti_remove_additional_tab', 98);
function haozhuti_remove_additional_tab($tabs) {unset($tabs['additional_information']); // 仅移除 「其他信息」
    return $tabs;
}

这样,「产品描述」 和 「用户评价」 仍会显示,页面信息保持完整。

 

五、延伸应用:仅对特定分类隐藏标签

如果你的商店中不同分类的产品需要显示不同的标签,可以加上条件判断:

add_filter('woocommerce_product_tabs', 'haozhuti_conditional_remove_tabs', 98);
function haozhuti_conditional_remove_tabs($tabs) {global $product;

    // 如果产品属于 「配件」 分类,就隐藏两个标签
    if (has_term('accessories', 'product_cat', $product->get_id())) {unset($tabs['additional_information']);
        unset($tabs['reviews']);
    }

    return $tabs;
}

这样可以实现更灵活的显示逻辑,比如:

  • 「主产品」 保留评价;
  • 「配件类产品」 隐藏所有附加信息。

 

总结

需求 解决方法
隐藏 「其他信息」 和 「用户评价」 使用 woocommerce_product_tabs 过滤器
仅显示描述内容 移除 WooCommerce 默认 Tabs 输出
临时隐藏标签 使用 CSS 隐藏
按分类控制显示 条件判断控制 Tabs 输出

 

 结语

通过以上几种方法,你可以完全掌控 WooCommerce 产品详情页的显示逻辑。
无论是想打造极简的销售页面,还是希望按产品类型灵活展示信息,都能轻松实现。

这种优化不仅能提升页面美观度,还能让用户在浏览时更聚焦于购买决策,从而提高转化率。

全文结束
 0
有趣源码
版权声明:本站原创文章,由 有趣源码 于 2025-10-19 发表,共计 2403 字。
转载说明:除特殊说明外本站文章皆由 CC-4.0 协议发布,转载请注明出处。特别声明:本站所有资源或内容,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
评论 (没有评论)